﻿<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title></title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="robots" content="all,follow">
    <!-- Bootstrap CSS-->
    <link rel="stylesheet" href="static/vendor/bootstrap/css/bootstrap.min.css">
    <!-- Font Awesome CSS-->
    <link rel="stylesheet" href="static/vendor/font-awesome/css/font-awesome.min.css">
    <!-- Fontastic Custom icon font-->
    <link rel="stylesheet" href="static/css/fontastic.css">
    <!-- Google fonts - Poppins -->
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins:300,400,700">
    <!-- theme stylesheet-->
    <link rel="stylesheet" href="static/css/style.default.css" id="theme-stylesheet">
    <!-- Custom stylesheet - for your changes-->
    <link rel="stylesheet" href="static/css/custom.css">
    <!-- Favicon-->
    <link rel="shortcut icon" href="static/img/favicon.ico">
    <!-- Tweaks for older IEs-->
    <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
        <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script><![endif]-->
</head>

<body>
    <div id="app">
        <div class="page login-page">
            <div class="container d-flex align-items-center">
                <div class="form-holder has-shadow">
                    <div class="row">
                        <!-- Logo & Information Panel-->
                        <div class="col-lg-6">
                            <div class="info d-flex align-items-center">
                                <div class="content">
                                    <div class="logo">
                                        <h1>淘书斋后台管理</h1>
                                    </div>
                                    <p>好好学习，天天向上</p>
                                </div>
                            </div>
                        </div>
                        <!-- Form Panel    -->
                        <div class="col-lg-6 bg-white">
                            <div class="form d-flex align-items-center">
                                <div class="content">
                                    <form method="post" class="form-validate">
                                        <div class="form-group">
                                            <input v-model="username" id="username" type="text" name="username" required data-msg="Please enter your username" class="input-material">
                                            <label for="login-username" class="label-material">帐号</label>
                                        </div>
                                        <div class="form-group">
                                            <input v-model="password" id="password" type="password" name="password" required data-msg="Please enter your password" class="input-material">
                                            <label for="login-password" class="label-material">密码</label>
                                        </div>
                                        <div>
                                            <input type="button" value="登录" class="btn btn-primary" @click="login()" />
                                        </div>

                                        <!-- This should be submit button but I replaced it with <a> for demo purposes-->

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="copyrights text-center">
                <p>Design by <a href="#" class="external">抓娃组</a>
                    <!-- Please do not remove the backlink to us unless you support further theme's development at https://bootstrapious.com/donate. It is part of the license conditions. Thank you for understanding :)-->
                </p>
            </div>
        </div>
    </div>
    <!-- JavaScript files-->
    <script src="static/vendor/jquery/jquery.min.js"></script>
    <script src="static/vendor/popper.js/umd/popper.min.js">
    </script>
    <script src="static/vendor/bootstrap/js/bootstrap.min.js"></script>
    <script src="static/vendor/jquery.cookie/jquery.cookie.js">
    </script>
    <script src="static/vendor/chart.js/Chart.min.js"></script>
    <script src="static/vendor/jquery-validation/jquery.validate.min.js"></script>
    <!-- Main File-->
    <script src="static/js/front.js"></script>
    <script src="static/node_modules/vue/dist/vue.js"></script>

    <script>
        var vm = new Vue({
            el: '#app',
            data: {
                username: '',
                password: '',
                //服务器47.100.136.219
                serverIp: 'http://47.100.136.219',
                ifLocal: false,
            },

            mounted() {
                if (this.ifLocal) {
                    this.serverIp = "http://localhost";
                }
            },

            methods: {

                login() {
                    console.log(this.username);
                    console.log(this.password);
                    let _this = this;
                    $.ajax({
                        url: _this.serverIp + ':8088/boot/login',
                        type: 'POST',
                        data: "username=" + _this.username + "&password=" + _this.password,
                        success: function(res, status) {
                            if (res.status == 200) {
                                location.href = "index.html";
                            } else {
                                alert("密码错误");
                            }


                        },
                        error: function(res, status) {
                            console.log(res);
                        }
                    });
                }

            },
        });
    </script>
</body>



</html>